export function getLayerImage(
  width: number,
  height: number,
  color: string,
  pixelsList: string[],
  stride: number[]
): string | null {
  const canvas = document.createElement('canvas');
  canvas.width = width;
  canvas.height = height;
  const ctx = canvas.getContext('2d');
  if (!ctx) {
    return null;
  }
  ctx.fillStyle = '#ffffff00';
  ctx.fillRect(0, 0, width, height);
  const imgData = ctx.getImageData(0, 0, width, height);
  const [r, g, b] = color.split(',');
  pixelsList.forEach((pixel: string) => {
    const [_x, _y] = pixel.split(',');
    const x = Number(_x);
    const y = Number(_y);
    imgData.data[stride[0] * x + stride[1] * y + 0] = Number(r);
    imgData.data[stride[0] * x + stride[1] * y + 1] = Number(g);
    imgData.data[stride[0] * x + stride[1] * y + 2] = Number(b);
    imgData.data[stride[0] * x + stride[1] * y + 3] = 255;
  });
  ctx.putImageData(imgData, 0, 0);
  return canvas.toDataURL();
}
